<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highsecondary" content="no">
    <meta name="viewport" content="user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1,width=device-width">

    <title>定价 -采方</title>
    <link href="../lib/fonts/material-icons.css?family=Material+Icons" rel="stylesheet">
    <link href="../lib/css/animate.min.css" rel="stylesheet">
    <link href="../lib/css/quasar.mat.rtl.min.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="../lib/vue-easytable/css/index.css">
    <style>
      [v-cloak] { display: none }
      .title-cell-class-name-test1 {
        background-color: #2db7f5;
      }
      .title-cell-class-name-test2 {
        background-color: #2db7f5;
        color: #fff;
      }
      .footer-cell-class-name-title {
        background-color: #2db7f5;
        color: #fff;
      }
      .footer-cell-class-name-normal {
        color: red;
      }
      /*表格字体*/
      .v-table-class {
        font-size: 14px;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      }
      /*表格表头*/
      .v-table-title-class {
        font-weight: normal;
        color: #333333;
        text-shadow: 0 0 0 #333333;
      }
      /*表格表体*/
      .v-table-body-class {
        font-weight: normal;
        color: #333333;
        text-shadow: 0 0 0 #333333;
      }
      /*表格foot*/
      .v-table-footer-class {
        font-weight: normal;
        color: #333333;
        text-shadow: 0 0 0 #333333;
      }

      /*表格内部滚动条样式*/
      .v-scrollbar-wrap::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        border-radius: 10px;
        background-color: #f5f5f5;
      }

      .v-scrollbar-wrap::-webkit-scrollbar {
        height: 12px;
        width: 10px;
        background-color: #f5f5f5;
      }

      .v-scrollbar-wrap::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        background-color: #666;
      }
    </style>
  </head>
  <body>
    <div id="q-rfxPurFixPrice" v-cloak>
      <q-layout>
        <q-page-container class="q-mx-sm">
          <q-tabs inverted color="primary">
            <q-tab default slot="title" name="base" label="基本信息"></q-tab>

            <q-tab-pane name="base" class="q-pa-none">
              <q-card class="bg-white no-shadow full-width">
                <q-card-main class="q-px-md q-py-sm relative-position">
                  <div class="q-ml-md row gutter-x-sm">
                    <span class="col-lg-4 col-md-6 col-sm-6 col-xs-12 q-mt-sm">
                      询价主题：
                      <span class="text-light">{{ baseInfoForm.title }}</span>
                    </span>
                    <span class="col-lg-4 col-md-6 col-sm-6 col-xs-12 q-mt-sm">
                      询价单号：
                      <span class="text-light">{{ baseInfoForm.code }}</span>
                    </span>
                    <span class="col-lg-4 col-md-6 col-sm-6 col-xs-12 q-mt-sm">
                      采购组织：
                      <span class="text-light">{{ baseInfoForm.purOrgName }}</span>
                    </span>
                    <span class="col-lg-4 col-md-6 col-sm-6 col-xs-12 q-mt-sm">
                      采购组：
                      <span class="text-light">{{ baseInfoForm.purGroupName }}</span>
                    </span>
                    <span class="col-lg-4 col-md-6 col-sm-6 col-xs-12 q-mt-sm">
                      采购执行人：
                      <span class="text-light">{{ baseInfoForm.purExecutorName }}</span>
                    </span>
                  </div>
                  <q-inner-loading :visible="visible">
                    <q-spinner-gears size="50px" color="primary"></q-spinner-gears>
                  </q-inner-loading>
                </q-card-main>
              </q-card>
            </q-tab-pane>
          </q-tabs>
          <div class="position-relative">
            <q-btn 
              color="primary" 
              size="sm" 
              push 
              class="q-my-sm" 
              @click="submitPriceAprove">提交价格审批</q-btn>
            <v-table
              ref="myTable"
              is-horizontal-resize
              column-width-drag
              style="width:100%"
              :min-height="300"
              even-bg-color="#f2f2f2"
              :title-rows="titleRows"
              :columns="columns"
              :table-data="tableData"
              :footer-cell-class-name="setFooterCellClass"
              title-bg-color=""
              row-hover-color="#eee"
              row-click-color="#edf7ff"
              :footer="footer"
              :footer-row-height="40"
              :cell-merge="cellMerge"
              :cell-edit-done="cellEditDone"
              :select-all="selectALL"
              :select-change="selectChange"
              @on-custom-comp="finalPriceOpen"
            ></v-table>
            <div class="row justify-end q-mt-sm">
              <v-pagination @page-change="pageChange" @page-size-change="pageSizeChange" :total="total" :page-size="pageSize" :layout="['total', 'prev', 'pager', 'next', 'sizer', 'jumper']"></v-pagination>
            </div>
            <!-- <q-inner-loading :visible="visibleTable">
              <q-spinner-gears size="50px" color="primary"></q-spinner-gears>
            </q-inner-loading> -->
          </div>
          <q-page-sticky position="top-right" :offset="[32,20]">
            <q-fab
              color="primary"
              icon="keyboard_arrow_down"
              direction="down"
            >
              <q-fab-action 
                color="secondary" 
                @click="window.history.go(-1)"
                icon="arrow_back">
                <q-tooltip anchor="center left" self="center right" :offset="[10, 10]">返回</q-tooltip>
              </q-fab-action>
            </q-fab>
          </q-page-sticky>
        </q-page-container>
      </q-layout>
      <!-- 选择最终价 -->
      <q-modal no-backdrop-dismiss v-model="finalPriceModal" :content-css="{minWidth: '88vw', minHeight: '550px',borderRadius: '4px'}">
        <q-modal-layout>
          <q-toolbar slot="header" color="white">
            <q-toolbar-title class="text-dark">
              <span>最终价</span>
            </q-toolbar-title>
            <q-btn flat @click="finalPriceModal = false">
              <q-icon name="close" color="dark"></q-icon>
            </q-btn>
          </q-toolbar>
          <q-card class="q-px-md q-py-sm bg-white no-shadow full-width">
            <q-card-main>
              <q-table
                class="no-shadow"
                :data="quoteTableData"
                dense
                hide-bottom
                :columns="quoteColumns"
                :rows-per-page-options="[5, 10, 20]"
                :loading="listLoading"
                :pagination.sync="serverPaginationQuote"
                @request="quoteListGet"
                row-key="id"
              >
                <template slot="body" slot-scope="props">
                    <q-tr
                    :props="props"
                  >
                    <q-td key="action" :props="props" >
                      <q-btn
                        flat
                        size="xs"
                        color="primary"
                        class="q-pa-xs"
                        @click="finalPriceConfirm(props.row.id)"
                      >
                        选择
                      </q-btn>
                    </q-td>
                    <q-td key="rfqItemEntity.matCode" :props="props" >
                      {{ props.row.rfqItemEntity.matCode }}
                    </q-td>
                    <q-td key="rfqItemEntity.matName" :props="props" >
                      {{ props.row.rfqItemEntity.matName }}
                    </q-td>
                    <q-td key="rfqItemEntity.quoteTempName" :props="props" >
                      {{ props.row.rfqItemEntity.quoteTempName }}
                    </q-td>
                    <q-td key="rfqSupplierEntity.supplierCode" :props="props" >
                      {{ props.row.rfqSupplierEntity.supplierCode }}
                    </q-td>
                    <q-td key="rfqSupplierEntity.supplierName" :props="props" >
                      {{ props.row.rfqSupplierEntity.supplierName }}
                    </q-td>
                    <q-td key="type" :props="props" >
                      <q-chip v-if="props.row.type == 1" dense square color="info">前期询价</q-chip>
                      <q-chip v-if="props.row.type == 2" dense square color="positive">正式报价</q-chip>
                    </q-td>
                    <q-td key="time" :props="props" >
                      {{ props.row.time }}
                    </q-td>
                    <q-td key="status" :props="props" >
                      <q-chip v-if="props.row.status == 1" dense square color="positive">已报价</q-chip>
                      <q-chip v-if="props.row.status == 0" dense square color="light">未报价</q-chip>
                      <q-chip v-if="props.row.status == -1" dense square color="info">报价中</q-chip>
                    </q-td>
                    <q-td key="rfqItemEntity.quantity" :props="props" >
                      {{ props.row.rfqItemEntity.quantity }}
                    </q-td>
                    <q-td key="totalPrice" :props="props" >
                      <a :href="'./rfxVendorProductionQuotationView.html?rfqItemId='+props.row.rfqItemId+'&headerId='+props.row.headerId+'&rfqSupplierId='+props.row.rfqSupplierId+'&quoteId='+props.row.id+'&type=1&backUrl=rfxPurFixPrice'" target="view_window">{{ props.row.totalPrice }}</a>
                    </q-td>
                    <q-td key="rfqItemEntity.currencyName" :props="props" >
                      {{ props.row.rfqItemEntity.currencyName }}
                    </q-td>
                  </q-tr>
                </template>
              </q-table>
              <div class="row justify-end items-center text-faded">
                每页的行数：
                <q-select 
                  :options="[{label: '5', value: 5},{label: '10', value: 10},{label: '20', value: 20}]" 
                  hide-underline
                  class="q-mr-md"
                  v-model="serverPaginationQuote.rowsPerPage"></q-select>
                第
                <q-pagination
                  class="q-mt-xs"
                  v-model="serverPaginationQuote.page"
                  input
                  boundary-links
                  direction-links
                  :max-pages="5"
                  :ellipses="true"
                  :max="pagesQuote"></q-pagination>
                页 &nbsp; 共 {{ totalQuote }} 条
              </div>
              <q-inner-loading :visible="visibleQuote">
                <q-spinner-gears size="50px" color="primary"></q-spinner-gears>
              </q-inner-loading>
            </q-card-main>
          </q-card>
        </q-modal-layout>
      </q-modal>
      <!-- 提交价格审批 -->
      <q-modal no-backdrop-dismiss v-model="priceReviewModal" :content-css="{minWidth: '77vw', minHeight: '550px',borderRadius: '4px'}">
        <q-modal-layout>
          <q-toolbar slot="header" color="white">
            <q-toolbar-title class="text-dark">
              <span>提交</span>
            </q-toolbar-title>
            <q-btn flat @click="priceReviewModal = false">
              <q-icon name="close" color="dark"></q-icon>
            </q-btn>
          </q-toolbar>
          <q-card class="q-px-md q-py-sm bg-white no-shadow full-width">
            <q-card-main class="row justify-between gutter-x-md gutter-y-xs">
              <q-field 
                label="信息类别"
                orientation="vertical"
                class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                <q-select 
                  :options="typeOptions"
                  v-model.trim="priceRviewForm.managerType"></q-input>
              </q-field>
              <q-field 
                label="价格类型"
                orientation="vertical"
                class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                <q-select 
                  :options="priceOptions"
                  v-model.trim="priceRviewForm.priceType"></q-input>
              </q-field>
              <q-field 
                label="价格开始时间"
                orientation="vertical"
                class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                <q-datetime 
                  type="datetime"
                  format="YYYY-MM-DD HH:mm:ss"
                  format-model="string"
                  v-model.trim="priceRviewForm.priceStartDate"></q-datetime>
              </q-field>
              <q-field 
                label="价格结束时间"
                orientation="vertical"
                class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                <q-datetime 
                  type="datetime"
                  format="YYYY-MM-DD HH:mm:ss"
                  format-model="string"
                  v-model.trim="priceRviewForm.priceEndDate"></q-datetime>
              </q-field>
            </q-card-main>
          </q-card>
          <q-toolbar slot="footer" color="white" class="row justify-end">
            <q-btn
              glossy
              :loading="btnLoading"
              color="primary"
              size="sm"
              @click="reviewConfirm">保存</q-btn>
            <q-btn
              glossy
              color="secondary"
              size="sm"
              class="q-ml-sm"
              @click="priceReviewModal = false">取消</q-btn>
          </q-toolbar>
        </q-modal-layout>
      </q-modal>
    </div>
    
    <!-- ie-polyfill 、 vue.js and quasar-framework -->
    <script src="../lib/js/quasar.ie.polyfills.umd.min.js"></script>
    <script src="../lib/js/vue.js"></script>
    <script src="../lib/js/quasar.mat.umd.min.js"></script>
    <!-- vue-easytable -->
    <script src="../lib/vue-easytable/js/index.js"></script>
    <!-- babel for es6 transform -->
    <!-- <script src="lib/js/babel.min.js"></script> -->
    <!-- vue validate -->
    <script src="../lib/js/vuelidate.min.js"></script>
    <script src="../lib/js/validators.min.js"></script>
    <!-- consts and utils ps: always leave this file first -->
    <script src="../script/consts.js"></script>
    <script src="../script/utils.js"></script>
    <!-- status code -->
    <script src="../script/status.code.js"></script>
    <!-- qs for axios -->
    <script src="../lib/js/qs.min.js"></script>
    <!-- axios for http request -->
    <script src="../lib/js/axios.js"></script>
    <!-- axios.instance must be after axios -->
    <script src="../script/axios.instance2.js"></script>
    <!-- quasar i18n zh-hans -->
    <script src="../lib/lang/zh-hans.js"></script>
    <!-- vue-i18n for application's internationalization -->
    <script src="../lib/js/vue-i18n.js"></script>
    <!-- current page international file -->
    <script src="../lang/sor/rfxPurFixPrice.js"></script>

    <script>
      Vue.component('price-temp', {
        props: {
          rowData:{
            type:Object
          },
          field:{
            type:String
          },
          index:{
            type:Number
          }
        },
        data: function() {
          return {
            url: '',
            lastField: ''
          }
        },
        mounted () {
          console.log(this.rowData,this.field, 1111);
          this.lastField =this.field.split('_')[1]
          this.url = './rfxVendorProductionQuotationView.html?rfqItemId='+this.rowData.rfqItemId+'&headerId='+this.rowData.headerId+'&rfqSupplierId='+this.rowData['rfqSupplierId_'+this.lastField]+'&quoteId='+this.rowData['finalQuoteId_'+this.lastField]+'&type=1&backUrl=rfxPurFixPrice'
        },
        template: '<span>' +
                    '<a :href="url" target="view_window" v-if="rowData[field]!=null">{{ rowData[field] }}</a>'+
                    '<a href="javascript:;" v-else @click.stop.prevent="choose">选择</a>' +
                  '</span>',
        methods: {
          choose: function(rowData, field, index) {
            params = {type:'choose',index:this.index,rowData:this.rowData,field:this.field};
            this.$emit('on-custom-comp',params);
          }
        }
      })
			// quasar components use
      Quasar.i18n.set(Quasar.i18n[LANGUGE])
      Vue.prototype.window = window
			new Vue({
        el: '#q-rfxPurFixPrice',
        i18n: i18n,
				data: function() {
					return {
            // loading
            btnLoading: false,
            currentId: '',
            visible: false,
            visibleQuote: false,
            visibleTable: false,
            listLoading: false,
            // options
            typeOptions: [
              {
                label: '标准业务',
                value: 0
              },
              {
                label: '委外业务',
                value: 3
              }
            ],
            priceOptions: [
              {
                label: '正式价',
                value: 'PB00'
              },
              {
                label: '暂估价',
                value: 'ZP01'
              }
            ],
            // 基本信息
            baseInfoForm: {
              title: '',
              type: '',
              purOrgName: '',
              purGroupName: '',
              purExecutorName: ''
            },
            // 
            vendors: [],
            vendorFieldList: [],
            vendorNameMap: {},
            curVendorsTotal:[],
            vendorsTotal:[],
            pageIndex:1,
            pageSize:20,
            total: 0,
            selectedIds: {},
            tableFmt: {
              operatorFmt: function(rowData, rowIndex, pagingIndex, field) {
                var fieldData = rowData[field];
                var returnStr = '<a href="#" onclick="">查看PSA</a>'; //TODO: 弹出PSA信息Dialog----待定
                return returnStr;
              },
              sorFmt: function(rowData, rowIndex, pagingIndex, field) {
                var fieldData = rowData[field];
                return ' <a href="./sorPreview.html?id='+ rowData.sorId +'" target="view_window">' + fieldData?fieldData: '' + "</a>";
              },
              moduleFmt: function(rowData, rowIndex, pagingIndex, field) {
                var fieldData = rowData[field];
                if (0 == fieldData) {
                  return "否";
                } else if (1 == fieldData) {
                  return "是";
                }
                return "--";
              },
              trStatusFmt: function(rowData, rowIndex, pagingIndex, field) {
                var fieldData = rowData[field];
                var isTr = rowData['isTr'];
                if(isTr == 1){
                  if (0 == fieldData) {
                      return "待审批";
                  } else if (1 == fieldData) {
                      return "通过";
                  } else if (-1 == fieldData) {
                      return "不通过";
                  }
                }
                return "--";
              },
              priceFmt: function(that ,rowData, rowIndex, pagingIndex, field) {
                // var fieldData = rowData[field];
                // if (fieldData) {
                //   return ' <a href="javascript:;" @click.stop.prevent="">' + fieldData + "</a>"; //TODO: 报价查看页面
                // }
                // return '<a href="javascript:;" onclick="finalPriceOpen()">选择</a>'; //TODO: 弹出正式价列表Dialog.选择最终价并回调刷新
              }
            },
            multipleSort: false,
            tableData: [],
            
            titleRows: [
              [
                { fields: ["id"], title: "操作", titleAlign: "center", rowspan: 2 },
                {
                  fields: [
                    "matName",
                    "matCode",
                    "unitName",
                    "currencyCode",
                    "taxName",
                    "deliveryTime",
                    "minOrderQty",
                    "targetPrice",
                    "adjustPrice",
                    "sorCode",
                    "isMoldCostShare"
                  ],
                  title: "明细信息",
                  titleAlign: "center",
                  colspan: 11
                }
                //动态字段
              ],
              [
                { fields: ["matName"], title: "零件名称", titleAlign: "center" },
                { fields: ["matCode"], title: "零件编码", titleAlign: "center" },
                { fields: ["sorCode"], title: "sor编码", titleAlign: "center" },
                { fields: ["unitName"], title: "单位", titleAlign: "center" },
                { fields: ["currencyCode"], title: "货币", titleAlign: "center" },
                { fields: ["taxName"], title: "税率", titleAlign: "center" },
                {
                  fields: ["deliveryTime"],
                  title: "计划要货天数",
                  titleAlign: "center"
                },
                {
                  fields: ["minOrderQty"],
                  title: "最小订单量",
                  titleAlign: "center"
                },
                {
                  fields: ["isMoldCostShare"],
                  title: "模具摊销",
                  titleAlign: "center"
                },
                { fields: ["targetPrice"], title: "目标价", titleAlign: "center" },
                { fields: ["adjustPrice"], title: "核算价", titleAlign: "center" }
                //动态字段
              ]
            ],
            footer: [[],[]],
            // 最终价格priceRviewForm
            finalPriceModal: false,
            currentSupId: '',
            quoteTableData: [],
            totalQuote: 0,
            serverPaginationQuote: {
              page: 1,
              rowsPerPage: 5,
              rowsNumber: 5
            },
            selectedQuote: [],
            // 提交价格审批
            priceReviewModal: false,
            priceRviewForm: {
              managerType: '',
              priceType: '',
              priceStartDate: '',
              priceEndDate: '',
            },
          }
				},
				computed: {
          columns: function() {
            return [
              {
                field: "id",
                width: 50,
                titleAlign: "center",
                columnAlign: "center",
                overflowTitle: true,
                type: "selection",
                isFrozen: false
              },
              {
                field: "matName",
                width: 120,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "matCode",
                width: 120,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "sorCode",
                width: 100,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false,
                formatter: (rowData, rowIndex, pagingIndex, field) => {
                  return this.tableFmt.sorFmt(rowData, rowIndex, pagingIndex, field);
                }
              }, //做超链接
              {
                field: "unitName",
                width: 50,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "currencyCode",
                width: 80,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "taxName",
                width: 120,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "deliveryTime",
                width: 80,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "minOrderQty",
                width: 80,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "isMoldCostShare",
                width: 80,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false,
                formatter: (rowData, rowIndex, pagingIndex, field) => {
                  return this.tableFmt.moduleFmt(
                    rowData,
                    rowIndex,
                    pagingIndex,
                    field
                  );
                }
              },
              {
                field: "targetPrice",
                width: 80,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              },
              {
                field: "adjustPrice",
                width: 80,
                columnAlign: "center",
                overflowTitle: true,
                isResize: true,
                isFrozen: false
              }
              //动态字段
            ]
          },
          quoteColumns: function() {
            return [
              {
                name: 'action',
                label: '操作',
                align: 'center',
                field: 'action'
              },
              {
                name: 'rfqItemEntity.matCode',
                label: '物料编码',
                align: 'center',
                field: 'rfqItemEntity.matCode'
              },
              {
                name: 'rfqItemEntity.matName',
                label: '物料名称',
                align: 'center',
                field: 'rfqItemEntity.matName'
              },
              {
                name: 'rfqItemEntity.quoteTempName',
                label: '报价模板',
                align: 'center',
                field: 'rfqItemEntity.quoteTempName'
              },
              {
                name: 'rfqSupplierEntity.supplierCode',
                label: '供应商编号',
                align: 'center',
                field: 'rfqSupplierEntity.supplierCode'
              },
              {
                name: 'rfqSupplierEntity.supplierName',
                label: '供应商名称',
                align: 'center',
                field: 'rfqSupplierEntity.supplierName'
              },
              {
                name: 'type',
                label: '报价类型',
                align: 'center',
                field: 'type'
              },
              {
                name: 'time',
                label: '轮次',
                align: 'center',
                field: 'time'
              },
              {
                name: 'status',
                label: '状态',
                align: 'center',
                field: 'status'
              },
              {
                name: 'rfqItemEntity.quantity',
                label: '数量',
                align: 'center',
                field: 'rfqItemEntity.quantity'
              },
              {
                name: 'totalPrice',
                label: '总价',
                align: 'center',
                field: 'totalPrice'
              },
              {
                name: 'rfqItemEntity.currencyName',
                label: '币种',
                align: 'center',
                field: 'rfqItemEntity.currencyName'
              },
            ]
          },
          pagesQuote: function() {
            return Math.ceil(this.totalQuote/this.serverPaginationQuote.rowsPerPage)
          },
        },
        watch: {
          'serverPaginationQuote.rowsPerPage': function(rowsPerPage) {
            this.quoteListGet({ pagination: this.serverPaginationQuote })
          },
          'serverPaginationQuote.page': function(page) {
            this.quoteListGet({ pagination: this.serverPaginationQuote })
          }
        },
        created: function() {
          var args = GetRequest()
          this.currentId = args.id
          this.baseInfoGet()
          this.init()
        },
        methods: {
          baseInfoGet: function() {
            var that = this
            this.visible = true
            axios({
              method: 'post',
              url: '/manager/rfq/main/getMainInfo/' + this.currentId,
            })
            .then(function(data) {
              that.baseInfoForm = data.data
              setTimeout(function() {
                that.visible = false
              }, 500);
            })
            .catch(function(err) {
              console.log(err)
            })
          },
          init: function() {
            var _this = this;
            axios({
              method: 'post',
              url: '/manager/rfq/pricing/getPricingSuppliers/'+this.currentId
            })
            .then(function(data) {
              var repData = data;
              if(repData.success){
                _this.vendors = repData.data;
                _this.setVendors();
                _this.setColumns();
                _this.setTitleRows();
                _this.loadData();
              }else{
                console.log(repData.msg);
              }
            })
            .catch(function(err) {
              console.log(err)
            })
          },
          loadData: function(){
            var _this = this;
            this.visibleTable = true
            axios({
              method: 'post',
              url: '/manager/rfq/pricing/query/'+this.currentId,
              data: {page: this.pageIndex,rows: this.pageSize}
            })
            .then(function(data) {
              var repData = data;
              if(repData.success){
                _this.tableData = repData.rows;
                // _this.total = repData.total;
                _this.curVendorsTotal = repData.curVendorTotal;
                _this.vendorsTotal = repData.vendorTotal;
                setTimeout(function() {
                  _this.visibleTable = false                  
                }, 500);
                _this.setFootData();
                _this.$refs['myTable'].resize()
              }else{
                console.log(repData.msg);
              }
            })
            .catch(function(err) {
              console.log(err)
            })
          },
          pageChange: function(pageIndex){
            console.log(pageIndex)
            this.pageIndex = pageIndex;
            this.loadData();
          },
          pageSizeChange: function(pageSize){
            console.log(pageSize);
            this.pageSize = pageSize;
            this.loadData();
          },
          setVendors: function() {
            if (this.vendors.length) {
              var _this = this;
              this.vendors.forEach(function(item, index) {
                var vendorCode = item.vendorCode;
                var vendorName = item.vendorName;
                var vendorFields = [];
                vendorFields.push("id_" + vendorCode);
                vendorFields.push("finallTotalPrice_" + vendorCode);
                vendorFields.push("quota_" + vendorCode);
                vendorFields.push("trApproveStatus_" + vendorCode);
                _this.vendorNameMap[vendorName] = vendorFields;
                _this.vendorFieldList.push.apply(_this.vendorFieldList, vendorFields);
              });
            }
          },
          setColumns: function() {
            if (this.vendorFieldList.length) {
              var _this = this;
              this.vendorFieldList.forEach(function(item, index) {
                var strArry = item.split("_");
                var prefix = strArry[0];
                var column = {
                  field: item,
                  width: 80,
                  columnAlign: "center",
                  isResize: true
                };
                switch (prefix) {
                  case "id":
                    column.width = 120;
                    column.formatter = function(
                      rowData,
                      rowIndex,
                      pagingIndex,
                      field
                    ) {
                      return _this.tableFmt.operatorFmt(
                        rowData,
                        rowIndex,
                        pagingIndex,
                        field
                      );
                    };
                    break;
                  case "trApproveStatus":
                    column.formatter = function(
                      rowData,
                      rowIndex,
                      pagingIndex,
                      field
                    ) {
                      return _this.tableFmt.trStatusFmt(
                        rowData,
                        rowIndex,
                        pagingIndex,
                        field
                      );
                    };
                    break;
                  case "finallTotalPrice":
                    column.componentName = 'price-temp'
                    // column.formatter = function(
                    //   rowData,
                    //   rowIndex,
                    //   pagingIndex,
                    //   field
                    // ) {
                    //   return _this.tableFmt.priceFmt(
                    //     rowData,
                    //     rowIndex,
                    //     pagingIndex,
                    //     field
                    //   );
                    // };
                    break;
                  case "quota":
                    column.isEdit = true;
                    break;
                  default:
                    break;
                }
                _this.columns.push(column);
              });
            }
          },
          setTitleRows: function() {
            var _this = this;
            if (this.vendorNameMap) {
              for (var vendorName in _this.vendorNameMap) {
                var vendorFields = _this.vendorNameMap[vendorName];
                var titleRow = {
                  fields: vendorFields,
                  title: vendorName,
                  titleAlign: "center",
                  colspan: vendorFields.length,
                  titleCellClassName: "title-cell-class-name-test2"
                };
                _this.titleRows[0].push(titleRow);
              }
            }
            if (this.vendorFieldList.length) {
              this.vendorFieldList.forEach(function(item, index) {
                var strArry = item.split("_");
                var prefix = strArry[0];
                var titleRow = {
                  fields: [item],
                  titleAlign: "center",
                  titleCellClassName: "title-cell-class-name-test2"
                };
                switch (prefix) {
                  case "id":
                    titleRow.title = "操作";
                    break;
                  case "trApproveStatus":
                    titleRow.title = "TR评审";
                    break;
                  case "finallTotalPrice":
                    titleRow.title = "最终价";
                    break;
                  case "quota":
                    titleRow.title = "配额%";
                    break;
                  default:
                    titleRow.title = "";
                    break;
                }
                _this.titleRows[1].push(titleRow);
              });
            }
          },
          setFootData: function() {
            var _this = this;
            var curAmountFoot = ["", "", "", "", "", "", "", "", "", "", "", ""];
            var totalAmountFoot = ["", "", "", "", "", "", "", "", "", "", "", ""];
            if (this.vendors.length) {
              this.vendors.forEach(function(item, index) {
                var vendorCurFoot = ["页面小计：", "", "", ""];
                var vendorTotFoot = ["报价总计：", "", "", ""];
                var curAmt = _this.curVendorsTotal[item.vendorCode + ""];
                var totAmt = _this.vendorsTotal[item.vendorCode + ""];
                vendorCurFoot[1] = curAmt+'';
                curAmountFoot.push.apply(curAmountFoot, vendorCurFoot);
                vendorTotFoot[1] = totAmt+'';
                totalAmountFoot.push.apply(totalAmountFoot, vendorTotFoot);
              });
              this.$set(this.footer,0,curAmountFoot);
              this.$set(this.footer,1,totalAmountFoot);
            }
          },
          setFooterCellClass: function(rowIndex, colIndex, value) {
            if ("页面小计：" == value || "报价总计：" == value) {
              return "footer-cell-class-name-title";
            } else {
              return "footer-cell-class-name-normal";
            }
          },
          cellMerge: function(rowIndex, rowData, field) {
            var _this = this;
            if (field.indexOf("trApproveStatus_") != -1) {
              return {
                colSpan: 1,
                rowSpan: _this.tableData.length,
                content: _this.tableFmt.trStatusFmt(rowData, rowIndex, 1,field),
                componentName: ""
              };
            }
          },
          cellEditDone: function(newValue,oldValue,rowIndex,rowData,field){
            // this.tableData[rowIndex][field] = newValue;
            if(!newValue){
              return;
            }
            if(isNaN(newValue)){
              alert('请输入0-100范围内的有效数字');
              return;
            }
            if(0>newValue || 100<newValue){
              alert('请输入0-100范围内的有效数字');
              return;
            }
            var strArry = field.split("_");
            var idField = 'id_'+strArry[1];
            var rows = this.tableData[rowIndex];
            var priceId = rows[idField];
            if(!priceId){
              console.log('priceId异常！！');
              return;
            }
            var _this = this;
            axios({
              method: 'post',
              url: '/manager/rfq/pricing/saveQuota/'+priceId,
              data: {quota: newValue}
            })
            .then(function (data) {
              var repData = data;
              if(repData.success){
                _this.loadData();
              }else{
              console.log(repData.msg);
              alert(repData.msg || '操作失败！');
              }
            })
            .catch(function (error) {
              console.log(error);
            })
          },
          selectChange: function(selection,rowData){
            console.log('select-change',selection,rowData);
            var itemId = rowData.rfqItemId;
            if(selection.length){
              this.selectedIds[itemId+''] = itemId;
            } else {
              delete this.selectedIds[itemId+''];
            }
            console.log(this.selectedIds);
          },
          selectALL: function(selection){
            if(selection.length){
              var _this = this;
              selection.forEach(function(item, index){
                  var itemId = item.rfqItemId;
                  _this.selectedIds[itemId+''] = itemId;
              });
            } else {
              this.selectedIds = {};
            }
            console.log(this.selectedIds);
          },
          submitPriceAprove: function(){
            if(JSON.stringify(this.selectedIds) == "{}"){
              this.$q.notify({
                message: '请勾选要提交的数据！',
                type: 'warning',
                icon: 'warning',
                timeout: 1000,
                position: 'top-right'
              })
              return;
            }
            this.priceRviewForm = {
              managerType: '',
              priceType: '',
              priceStartDate: '',
              priceEndDate: '',
            },
            this.priceReviewModal = true
            
            
            // axios.post('http://localhost:8080//qeweb-sourcing/manager/rfq/pricing/createPricingApproval',params)//application/json
            //       .then(function (response) {
            //           var repData = response.data;
            //           if(repData.success){
            //             _this.loadData();
            //           }else{
            //           console.log(repData.msg);
            //           alert(repData.msg || '操作失败！');
            //           }
            //         })
            //       .catch(function (error) {
            //         console.log(error);
            //       });
          },
          finalPriceOpen: function(parmas) {
            var rowData = parmas.rowData
            var field = parmas.field
            var o = 'id_' + field.split('_')[1]
            this.currentSupId = rowData[o]
            this.finalPriceModal = true
            this.quoteListGet({ pagination: this.serverPaginationQuote })
          },
          quoteListGet: function(arg) {
            var that = this 
            this.listLoading = true
            this.visibleQuote = true
            this.serverPaginationQuote = arg.pagination
            axios({
              method: 'post',
              url: '/manager/rfqvendor/quote/queryOfficialQuote/' + this.currentSupId,
              data: {
                page: this.serverPaginationQuote.page,
                rows: this.serverPaginationQuote.rowsPerPage,
                sort: this.serverPaginationQuote.sortBy,
                order: this.serverPaginationQuote.descending == true? 'desc' : (this.serverPaginationQuote.descending == false? 'asc' : null),
              }
            })
            .then(function(data) {
              that.quoteTableData = data.rows
              that.totalQuote = data.total
              that.listLoading = false
              setTimeout(function() {
                that.visibleQuote = false
              }, 500);
            })
            .catch(function(err) {
              console.log(err)
            })
          },
          finalPriceConfirm: function(priceId) {
            var that = this 
            axios({
              method: 'post',
              url: '/manager/rfq/pricing/setFinalPrice/' + this.currentSupId + '/' + priceId,
            })
            .then(function(data) {
              if (data.success) {
                that.$q.notify({
                  message: '操作成功',
                  type: 'positive',
                  icon: 'done',
                  timeout: 1000,
                  position: 'top-right'
                })
              } else {
                that.$q.notify({
                  message: data.msg,
                  type: 'negative',
                  icon: 'error_outline',
                  timeout: 1000,
                  position: 'top-right'
                })
              }
              that.finalPriceModal = false
              that.loadData()
            })
            .catch(function(err) {
              console.log(err)
            })
          },
          reviewConfirm: function() {
            var _this = this;
            var ids = '';
            var selected = this.selectedIds;
            for(var i in selected) {
              ids+=selected[i]+',';
            }
            this.priceRviewForm.priceStartDate = timeUtil(this.priceRviewForm.priceStartDate)
            this.priceRviewForm.priceEndDate = timeUtil(this.priceRviewForm.priceEndDate)
            this.priceRviewForm.headerId = this.currentId
            this.priceRviewForm.ids = ids
            axios({
              method: 'post',
              url: '/manager/rfq/pricing/createPricingApproval',
              data: this.priceRviewForm
            })
            .then(function (data) {
              var repData = data;
              if(repData.success){
                _this.$q.notify({
                  message: '操作成功',
                  type: 'positive',
                  icon: 'done',
                  timeout: 1000,
                  position: 'top-right'
                })
                _this.baseInfoGet()
                _this.loadData();
              }else{
                _this.$q.notify({
                  message: repData.msg,
                  type: 'negative',
                  icon: 'error_outline',
                  timeout: 1000,
                  position: 'top-right'
                })
              }
              _this.priceReviewModal = false
            })
            .catch(function (error) {
              console.log(error);
            });
          }
        }
			})
      
    </script>
  </body>
</html>